<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
	body {
	font-size: 12px;
	background-image: url(images/bg.gif);
	background-repeat: repeat;
}
</style>
<script type='text/javascript' src='<%=request.getContextPath() %>/js/Charts/FusionCharts.js'></script>
<script type='text/javascript' src='<%=request.getContextPath() %>/js/Charts/jquery.min.js'></script>
<script type="text/javascript"
	src="<%=request.getContextPath()%>/js/My97DatePicker/WdatePicker.js"></script>
<%-- <script type="text/javascript"
	src="<%=request.getContextPath()%>/js/jquery-1.8.2.min.js"></script>
<link href="<%=request.getContextPath()%>/css/bootstrap.min.css"
	rel="stylesheet">
<script src="<%=request.getContextPath()%>/js/bootstrap.min.js"></script>
<script type="text/javascript"> --%>
</script>
</head>
<body>
	<center>
		<!-- 
		<form class="form-inline" >
			<div class="form-group has-success">
				<label for="search" class="col-sm-5 control-label">选班级</label>
				<div class="col-sm-7">
					<select name="cid" class="form-control">
						<option value="0">请选择</option>
						<c:forEach items="${classList }" var="cc">
							<option value="${cc.id }">${cc.name }</option>
						</c:forEach>
					</select>
			
				</div>
			</div>
			<div class="form-group has-success">
				<label for="search" class="col-sm-5 control-label">选类型</label>
				<div class="col-sm-7">
					<select name="i"  class="form-control">
						<option value="1">面试量</option>
						<option value="2">诊断量</option>
					</select>
			
				</div>
			</div>
			<div class="form-group">
				<label for="name" class="col-sm-4 control-label">起始日期</label>
				<div class="col-sm-8">
					<input type="text" name="start" onclick="WdatePicker()" readonly="readonly"
						placeholder="请選擇日期" />
				</div>
			</div>
			<div class="form-group">
				<label for="name" class="col-sm-4 control-label">結束日期</label>
				<div class="col-sm-8">
					<input type="text" name="end" onclick="WdatePicker()" readonly="readonly"
						placeholder="请選擇日期" />
				</div>
			</div> 
			
			 <input
				type="text" value="${sname }" name="sname" /> --%>
			<!-- <input type="submit" class="btn btn-info" value="搜索" /> 
			<button id="ok" class="btn btn-warning">搜索</button>
		</form>
	 -->
	
	
	
	 <form action="" method="post">
			选择班级
			<select name="cid">
				<c:forEach items="${classList }" var="cc">
					<option value="${cc.id }">${cc.name }</option>
				</c:forEach>
			</select>
			选择类型
			<select name="i">
				<option value="1">面试量</option>
				<option value="2">诊断量</option>
			</select>
			起始日期
			<input type="text" name="start" onclick="WdatePicker()" readonly="readonly"/>
			结束日期
			<input type="text" name="end" onclick="WdatePicker()" readonly="readonly"/>
			<input type="button" id="ok" value="确定"/>
		</form> 
	
		<dir id="course"></dir>
		<div id="div"></div>
	</center>
</body>
  <script type="text/javascript">
  $(function (){
	  $("#ok").click(function (){
		  $.post(
			"<%=request.getContextPath() %>/chart/myChart",
			$("form").serialize(),
			function (data){
				var chart = new FusionCharts("<%=request.getContextPath() %>/js/Charts/Column3D.swf", "hartId", "600", "500");
			   	var json = data.list;
			   	var list = eval(json);
			   	var charts = "<chart showBorder='1' yAxisMinValue='0' borderColor='#cfaec1' yAxisMaxValue='50' xaxisname='时间' yaxisname='"+data.ziduan+"' >";
			   	for(var i = 0; i < list.length; i++){
			   		charts+="<set name='"+list[i].date+"' value='"+list[i].count+"' />"
					}
					charts +="</chart>";
					chart.setDataXML(charts);
					chart.render("div");
			},
			"json"
		  );
	  })
  })
  
    
	</script>
</html>